@import "basis";
swiper {
  height: 422rpx;
  .slide-image {
    width: 100%;
  }
}
.details-box {
  margin-bottom: 30rpx;
  background-color: #fff;
  border-radius:0px 0px 36rpx 36rpx;
  overflow: hidden;
}
h4{
  margin: 0 auto;
  padding: 30rpx;
  font-size:36rpx;
  color: #333;
  background-color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.comment-box {
  position: relative;
  padding:0 30rpx;
  height: 54rpx;
  background-color: #fff;
  font-size: 24rpx;
  >div{
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 14rpx;
    background:url("../../../../static/images/icon-right.png") no-repeat right center rgba(215, 80, 58, .1);
    background-size: 24rpx auto;
    border-radius: 16rpx;
    img{
      width: 40rpx;
      /*margin-right: 20rpx;*/
    }
    b{
      flex: 1;
      text-align: right;
      padding-right: 10rpx;
    }
    div {
      display: flex;
      align-items: center;
      p {
        margin-left: 10rpx;
        font-size: 28rpx;
        color: $colorRed;
      }
    }
  }
}
.site-box {
  background-color: #fff;
  ul{
    padding: 0 3vw;
    li{
      display: flex;
      align-items: center;
      height: 96rpx;
      background: url("../../../../static/images/icon-right.png") no-repeat right center;
      background-size: 30rpx auto;
      overflow: hidden;
      &:last-child{
        background:none;
      }
      i {
        width: 40rpx;
        margin-right: 16rpx;
      }
      p {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 28rpx;
      }
    }

  }
}
.allContent {
  .title-box{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 96rpx;
    font-size: 30rpx;
    background-color: #fff;
    text-indent: 30rpx;
    &:before{
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      width:6rpx;
      height:33rpx;
      background:$greenGradient;
      transform: translateY(-50%);
    }
    &:after {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      width:6rpx;
      height:14rpx;
      background:rgba(0,158,58,1);
      transform: translateY(-50%);
    }
    >div {
      display: flex;
      align-items: center;
      font-size: 26rpx;
      color: #666;
      i {
        width: 20rpx;
        margin-left: 10rpx;
        .up {
          transform: rotate(180deg);
        }
      }
    }
  }
}
.booking-box {
  display: flex;
  align-items: center;
  padding:30rpx 30rpx 50rpx;
  background-color: #fff;
  border-radius: 20rpx;
  margin-bottom: 20rpx;
  /*&:last-child {*/
  /*border-bottom: 0;*/
  /*}*/
  .pay-box {
    width:160rpx;
    height:68rpx;
    background:rgba(215,80,58,1);
    box-shadow:0px 5rpx 12rpx 0 rgba(170,24,0,0.23);
    border-radius:34rpx;
    color: #fff;
    text-align: center;
    line-height: 68rpx;
  }
  h2 {
    font-size: 32rpx;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .price-box{
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0 20rpx ;
    div{
      display: flex;
      align-items: flex-end ;
      margin-top: 30rpx;
      line-height: 1;
      p {
        display: flex;
        align-items: flex-end ;
        font-size: 32rpx;
        color: $colorRed;
        b{
          font-size: 48rpx;
        }
        i {
          font-size: 24rpx;
        }
      }
    }

    del {
      display: inline-block;
      text-decoration:line-through;
      font-size:24rpx;
      color: #999;
    }
  }
}
.bar {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  background: #F5F6F7;
  div {
    flex: 1;
    text-align: center;
    height: 96rpx;
    line-height: 96rpx;
    font-size: 28rpx;
    font-weight: bold;
    &.active{
      position: relative;
      font-size: 30rpx;
      &:before {
        content: '';
        position: absolute;
        left: 50%;
        bottom: 0;
        width: 70rpx;
        height: 6rpx;
        background: $greenGradient;
        transform: translateX(-50%);
      }
    }
  }
}
.tabContent {
  >div {
    margin-top: 3vw;
    padding-right: 30rpx;
    padding-left: 30rpx;
    padding-bottom: 50rpx;
    border-radius: 36rpx;
    overflow: hidden;
    background-color: #fff;
    &#tabs1{
      padding-bottom: 0;
      background-color: transparent;
    }
  }
}
.content-box {
  font-size: 28rpx;
  height: 180rpx;
  overflow: hidden;
  &.more {
    height: auto;
  }
}
.comment-details {
  radio{
    display: none;
  }
  radio .wx-radio-input.wx-radio-input-checked{
    background: red;
  }
  .classify-label {
    display: inline-block;
    margin-right: 2vw;
    margin-top: 2vw;
    padding: 0 25rpx;
    height: 56rpx;
    line-height: 56rpx;
    font-size: 24rpx;
    color: #333;
    text-align: center;
    border-radius: 28rpx;
    overflow: hidden;
    background-color: #E5F5EB;
    &.active {
      background-color: $colorGreen;
      color: #fff;
    }
  }
}

.off-box {
  margin-top: 30rpx;
  border-bottom: 1px solid #999;
  img {
    width:40rpx;
    margin: 0 auto;
    &.on {
      transform: rotate(180deg);
    }
  }
}
